<template>
  <div id="studentProfile">
    <a-space direction="vertical" size="large" fill STYLE="padding-top: 30px">
      <a-descriptions
        :data="data"
        title="学生信息"
        layout="inline-horizontal"
      />
    </a-space>
    <a-steps :current="status" status="finish" class="currentStep">
      <a-step description="This is a description">未就业</a-step>
      <a-step description="This is a description">申请中</a-step>
      <a-step description="This is a description">就业成功</a-step>
    </a-steps>
    <a-upload
      class="uploadBox"
      draggable
      :with-credentials="true"
      :limit="1"
      auto-upload="auto-upload"
      action="http://localhost:8080/student/upload"
      @success="handleUpload"
    />
    <!--    <a-button type="primary" shape="round">提交申请</a-button>-->
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import message from "@arco-design/web-vue/es/message";

let userName = sessionStorage.getItem("LoginUserName");
let userMajorClass = sessionStorage.getItem("LoginUserMajorClass");
let userAccount = sessionStorage.getItem("LoginUserAccount");

let status = ref(1);
const resume = ref();

const data = [
  {
    label: "姓名",
    value: userName,
    span: 3,
  },
  {
    label: "专业班级",
    value: userMajorClass,
  },
  {
    label: "学号",
    value: userAccount,
  },
];

const handleUpload = async () => {
  message.success("上传成功");
};
</script>

<style scoped>
#studentProfile {
}

.currentStep {
  padding-top: 30px;
}

.uploadBox {
  padding-top: 30px;
  margin-bottom: 30px;
}
</style>

<!--<template>-->
<!--  <div id="studentProfile">-->
<!--    <a-form-->
<!--      ref="formRef"-->
<!--      :size="form.size"-->
<!--      :model="form"-->
<!--      :style="{ width: '600px' }"-->
<!--      @submit="handleSubmit"-->
<!--    >-->
<!--      <a-form-item field="size" label="Form Size">-->
<!--        <a-radio-group v-model="form.size" type="button">-->
<!--          <a-radio value="mini">Mini</a-radio>-->
<!--          <a-radio value="small">Small</a-radio>-->
<!--          <a-radio value="medium">Medium</a-radio>-->
<!--          <a-radio value="large">Large</a-radio>-->
<!--        </a-radio-group>-->
<!--      </a-form-item>-->
<!--      <a-form-item-->
<!--        field="sid"-->
<!--        label="学号"-->
<!--        :rules="[-->
<!--          { required: true, message: '请填写您的学号' },-->
<!--          { minLength: 10, message: '学号为10为数字' },-->
<!--        ]"-->
<!--        :validate-trigger="['change', 'input']"-->
<!--      >-->
<!--        <a-input v-model="form.sid" placeholder="请输入您的学号..." />-->
<!--      </a-form-item>-->
<!--      <a-form-item field="name" label="姓名">-->
<!--        <a-input v-model="form.name" placeholder="请输入您的姓名..." />-->
<!--      </a-form-item>-->
<!--      <a-form-item-->
<!--        field="majorClass"-->
<!--        label="专业班级"-->
<!--        :rules="[{ match: /section one/, message: 'must select one' }]"-->
<!--      >-->
<!--        <a-select-->
<!--          v-model="form.majorClass"-->
<!--          placeholder="请选择你的班级"-->
<!--          allow-clear-->
<!--          :rules="[{ required: true, message: '班级不能为空！' }]"-->
<!--        >-->
<!--          <a-option value="1">计算机科学与技术01班</a-option>-->
<!--          <a-option value="2">计算机科学与技术02班</a-option>-->
<!--          <a-option value="3">大数据与数据科学01班</a-option>-->
<!--          <a-option value="4">大数据与数据科学01班</a-option>-->
<!--          <a-option value="5">生物医学工程01班</a-option>-->
<!--          <a-option value="6">生物医学工程02班</a-option>-->
<!--        </a-select>-->
<!--      </a-form-item>-->
<!--      <a-form-item field="province" label="意向城市">-->
<!--        <a-cascader-->
<!--          v-model="form.province"-->
<!--          :options="options"-->
<!--          placeholder="请选择你的意向城市..."-->
<!--          allow-clear-->
<!--        />-->
<!--      </a-form-item>-->
<!--      &lt;!&ndash;      <a-form-item&ndash;&gt;-->
<!--      &lt;!&ndash;        field="options"&ndash;&gt;-->
<!--      &lt;!&ndash;        label="Options"&ndash;&gt;-->
<!--      &lt;!&ndash;        :rules="[&ndash;&gt;-->
<!--      &lt;!&ndash;          {&ndash;&gt;-->
<!--      &lt;!&ndash;            type: 'array',&ndash;&gt;-->
<!--      &lt;!&ndash;            minLength: 2,&ndash;&gt;-->
<!--      &lt;!&ndash;            message: 'must select greater than two options',&ndash;&gt;-->
<!--      &lt;!&ndash;          },&ndash;&gt;-->
<!--      &lt;!&ndash;        ]"&ndash;&gt;-->
<!--      &lt;!&ndash;      >&ndash;&gt;-->
<!--      &lt;!&ndash;        <a-checkbox-group v-model="form.options">&ndash;&gt;-->
<!--      &lt;!&ndash;          <a-checkbox value="option one">Section One</a-checkbox>&ndash;&gt;-->
<!--      &lt;!&ndash;          <a-checkbox value="option two">Option Two</a-checkbox>&ndash;&gt;-->
<!--      &lt;!&ndash;          <a-checkbox value="option three">Option Three</a-checkbox>&ndash;&gt;-->
<!--      &lt;!&ndash;          <a-checkbox value="option four">Option Four</a-checkbox>&ndash;&gt;-->
<!--      &lt;!&ndash;        </a-checkbox-group>&ndash;&gt;-->
<!--      &lt;!&ndash;      </a-form-item>&ndash;&gt;-->
<!--      <a-form-item field="satisfaction" label="导师满意度">-->
<!--        <a-rate v-model="form.satisfaction" allow-clear />-->
<!--      </a-form-item>-->
<!--      <a-form-item label="在校荣誉" :content-flex="false" :merge-props="false">-->
<!--        <a-form-item-->
<!--          v-for="(post, index) of form.posts"-->
<!--          :field="`posts[${index}].value`"-->
<!--          :label="`荣誉奖项-${index + 1}`"-->
<!--          :key="index"-->
<!--        >-->
<!--          <a-input v-model="post.value" placeholder="请添加您所获得的荣誉" />-->
<!--          <a-button-->
<!--            v-if="form.posts.length > 1"-->
<!--            @click="handleDelete(index, 'posts')"-->
<!--            :style="{ marginLeft: '10px' }"-->
<!--          >-->
<!--            删除-->
<!--          </a-button>-->
<!--          <a-button-->
<!--            v-if="index === form.posts.length - 1"-->
<!--            @click="handleAdd('posts')"-->
<!--            style="margin-left: 10px"-->
<!--          >-->
<!--            添加-->
<!--          </a-button>-->
<!--        </a-form-item>-->
<!--      </a-form-item>-->
<!--      <a-form-item label="实习经历" :content-flex="false" :merge-props="false">-->
<!--        <a-form-item-->
<!--          v-for="(experience, index) of form.experience"-->
<!--          :field="`experience[${index}].value`"-->
<!--          :label="`实习-${index + 1}`"-->
<!--          :key="index"-->
<!--        >-->
<!--          <a-input-->
<!--            v-model="experience.value"-->
<!--            placeholder="请添加您的实习经历"-->
<!--          />-->
<!--          <a-button-->
<!--            v-if="form.experience.length > 1"-->
<!--            @click="handleDelete(index, 'experience')"-->
<!--            :style="{ marginLeft: '10px' }"-->
<!--          >-->
<!--            删除-->
<!--          </a-button>-->
<!--          <a-button-->
<!--            v-if="index === form.experience.length - 1"-->
<!--            @click="handleAdd('experience')"-->
<!--            style="margin-left: 10px"-->
<!--          >-->
<!--            添加-->
<!--          </a-button>-->
<!--        </a-form-item>-->
<!--      </a-form-item>-->
<!--      <a-form-item field="intention" label="求职意向">-->
<!--        <a-input v-model="form.intention" placeholder="请输入您的求职意向..." />-->
<!--      </a-form-item>-->
<!--      <a-form-item>-->
<!--        <a-space>-->
<!--          <a-button html-type="submit">Submit</a-button>-->
<!--          <a-button @click="$refs.formRef.resetFields()">Reset</a-button>-->
<!--        </a-space>-->
<!--      </a-form-item>-->
<!--    </a-form>-->
<!--  </div>-->
<!--</template>-->

<!--<script setup lang="ts">-->
<!--import { reactive } from "vue";-->

<!--const form = reactive({-->
<!--  size: "medium",-->
<!--  name: "",-->
<!--  age: undefined,-->
<!--  section: "",-->
<!--  province: "海淀",-->
<!--  options: [],-->
<!--  date: "",-->
<!--  time: "",-->
<!--  radio: "radio one",-->
<!--  slider: 5,-->
<!--  score: 5,-->
<!--  switch: false,-->
<!--  multiSelect: ["section one"],-->
<!--  treeSelect: "",-->
<!--  posts: [{ value: "" }],-->
<!--  experience: [{ value: "" }],-->
<!--});-->
<!--const options = [-->
<!--  {-->
<!--    value: "北京",-->
<!--    label: "北京",-->
<!--    children: [-->
<!--      {-->
<!--        value: "朝阳",-->
<!--        label: "朝阳",-->
<!--        children: [-->
<!--          {-->
<!--            value: "大屯里",-->
<!--            label: "大屯里",-->
<!--          },-->
<!--        ],-->
<!--      },-->
<!--      {-->
<!--        value: "海淀",-->
<!--        label: "海淀",-->
<!--      },-->
<!--      {-->
<!--        value: "东城",-->
<!--        label: "东城",-->
<!--      },-->
<!--      {-->
<!--        value: "西城",-->
<!--        label: "西城",-->
<!--      },-->
<!--    ],-->
<!--  },-->
<!--  {-->
<!--    value: "上海",-->
<!--    label: "上海",-->
<!--    children: [-->
<!--      {-->
<!--        value: "上海市",-->
<!--        label: "上海",-->
<!--        children: [-->
<!--          {-->
<!--            value: "黄埔",-->
<!--            label: "黄埔",-->
<!--          },-->
<!--        ],-->
<!--      },-->
<!--    ],-->
<!--  },-->
<!--];-->
<!--const treeData = [-->
<!--  {-->
<!--    key: "node1",-->
<!--    title: "Node1",-->
<!--    children: [-->
<!--      {-->
<!--        key: "node2",-->
<!--        title: "Node2",-->
<!--      },-->
<!--    ],-->
<!--  },-->
<!--  {-->
<!--    key: "node3",-->
<!--    title: "Node3",-->
<!--    children: [-->
<!--      {-->
<!--        key: "node4",-->
<!--        title: "Node4",-->
<!--      },-->
<!--      {-->
<!--        key: "node5",-->
<!--        title: "Node5",-->
<!--      },-->
<!--    ],-->
<!--  },-->
<!--];-->

<!--const handleAdd = (type: string) => {-->
<!--  if (type === "posts") {-->
<!--    form.posts.push({ value: "" });-->
<!--  } else if (type === "experience") {-->
<!--    form.experience.push({ value: "" });-->
<!--  }-->
<!--};-->

<!--const handleDelete = (index: number, type: string) => {-->
<!--  if (type === "posts") {-->
<!--    if (form.posts.length > 1) {-->
<!--      form.posts.splice(index, 1);-->
<!--    }-->
<!--  } else if (type === "experience") {-->
<!--    if (form.experience.length > 1) {-->
<!--      form.experience.splice(index, 1);-->
<!--    }-->
<!--  }-->
<!--};-->
<!--const handleAdd2 = () => {-->
<!--  form.experience.push({-->
<!--    value: "",-->
<!--  });-->
<!--};-->
<!--const handleDelete2 = ({ index }: { index: any }) => {-->
<!--  form.experience.splice(index, 1);-->
<!--};-->
<!--</script>-->

<!--<style scoped>-->
<!--#studentProfile {-->
<!--}-->
<!--</style>-->
